<template>
	<div class="channel">
		<component :is="mainComponent" v-if="isShowAd"></component>
		<ChannelItem :newstype="news" :newsListAd="channelNewsListAd" :newsId="news" :channelTitle="channelTitle" :channelId="channelId" type="news" />
		<MoreChannels :channels="channels" />
	</div>
</template>

<script>
	import ChannelItem from "../components/common/channel-item.vue";
	import MoreChannels from "../components/common/more-channels.vue";
	export default {
		name: "Channel",
		props:["type", "channels","mainComponent"],
		data:function(){
			return {
				news:"",
				channelTitle: "",
				channelId: "",
				isShowAd: this.$store.state.ad.channelMainAd,
				channelNewsListAd: this.$store.state.ad.channelNewsListAd
			}
		},
		methods:{
			init: function(){
				let cid = this.$route.params.cid,
					channel = this.getNewsChannel(cid),
					name = (channel && channel.title || '');
				this.$set(this, "news", cid);
				this.$set(this, "channelId", cid);
				this.$set(this, "channelTitle", name+"频道");
				this.$emit("upLocalData", [{
					name: "type",
					value: "channel"
				},{
					name: "channelName",
					value: name
				}]);
			},
			getNewsChannel(cid){
				let channel = null;
				this.$store.state.channels().each((i, item) => {
					if (item.url.params && item.url.params.cid === parseFloat(cid)){
						channel = item;
						return false;
					}
				});
				return channel;
			}
		},
		created:function(){
			this.init();
		},
		mounted:function(){
			window.scrollTo(1,1)
		},
		components:{
			ChannelItem,
			MoreChannels
		},
		watch:{
			$route:function(){
				this.init();
				window.scrollTo(1,1)
			}
		}
	}
</script>

<style lang="less">
	@base:23.44/1rem;
	.channel{
		
	}
</style>
